<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>我的证书</title>
		<style type="text/css">
			* {
				padding: 0;
				margin: 0;
			}
			body {
				font-family: Times New Roman;
				height: 1124px;
				width: 793px;
				margin: 0 auto;
			}

			@page {
				size: a4;
				margin: 0;
			}
			.certificate_box {
				width: 793px;
			}
			.certificate {
				width: 795px;
			}
			.tc {
				text-align: center;
			}
			.cer_left {
				width: 795px;
				height: 1124px;
			}
			.cer_right {
				width: 795px;
			}
			.left_top {
				border-bottom: 1px solid #eee;
				text-align: center;

				width: 720px;
				margin: 0px auto;
				height: 109px;
			}
			.left_center {
				text-align: center;
				width: 100%;
				padding-top: 20px;
				height: 693px;
			}
			.pertwenty {
				width: 20%;
			}
			.green_bg {
				width: 795px;
				height: 219px;
				padding: 16px 0;
				background-color: rgb(47, 73, 88);
				color: rgba(255, 255, 255, 0.85);
				vertical-align: middle;
			}
			.code_box {
			}
			.notes {
			}
			.notes_detail {
				padding: 10px 0;
				font-size: 15px;
				color: gray;
			}
			.evident {
				color: #28b3ae;
				font-size: 35px;
				font-weight: bold;
				padding-top: 15px;
			}
			.border {
				width: calc(100% - 60px);
				border: 1px solid #000;
				padding: 0;
				margin: 30px;
			}
			.key {
				letter-spacing: 10px;
			}
			.fs10 {
				font-size: 16px;
			}
			.fs12 {
				font-size: 12px;
			}
			.fs16 {
				font-size: 16px;
			}
			.fs18 {
				font-size: 26px;
				color: #585757;
				font-weight: 500;
			}
			.address {
				font-size: 26px;
				height: 82px;
				line-height: 42px;
				color: #585757;
				font-weight: 500;
				padding-top: 10px;
			}
			.fs20 {
				font-size: 20px;
			}
			.fs21 {
				font-size: 21px;
			}
			.fs22 {
				font-size: 26px;
				height: 55px;
				line-height: 55px;
				color: #585757;
				font-weight: 500;
			}
			.fs24 {
				font-size: 24px;
			}
			.fs30 {
				font-size: 30px;
			}
			.cola9 {
				color: #5d6062;
			}
			.pl15 {
				padding-left: 15px;
			}
			.pb5 {
				padding-bottom: 5px;
			}
			.pb10 {
				padding-bottom: 10px;
			}
			.ptb10 {
				font-size: 26px;
				height: 55px;
				line-height: 55px;
				color: #585757;
				font-weight: 500;
			}
			.pb5 {
				padding-bottom: 5px;
			}
			.ptb5 {
				padding-top: 5px;
				padding-bottom: 5px;
			}
			.fwb {
				font-weight: bold;
			}
			.link {
				color: #fff;
				display: block;
				text-align: center;
				text-decoration: none;
				word-break: break-all;
				width: 100%;
				font-size: 8px;
			}
			.pt10 {
				padding-top: 10px;
			}
			.relative {
				position: relative;
			}
			.right_item {
			}
			td {
				border: 1px solid #eee;
				padding: 12px 4px;
				font-size: 12px;
				border-left: none;
				border-bottom: none;
			}
			.usage {
				line-height: 42px;
			}
			.img_irec {
				line: 111px;
				margin-top: 30px;
			}
			.country {
				font-size: 26px;
				color: #585757;
				font-weight: 500;
			}
			.report_date_div {
				font-size: 22px;
				height: 80px;
				line-height: 80px;
				color: #585757;
				font-weight: 500;
			}
			.report_date {
				font-size: 26px;
				height: 55px;
				line-height: 55px;
				color: #585757;
				font-weight: 500;
			}
			.purpose_cb_logo_div {
			}
			.img_cb {
				height: 50px;
				margin: 0 auto 30px;
			}
			.buttom_area {
				height: 274px;
			}
			.img_cb_div {
				text-align: center;
			}
			.img_evident_div {
				text-align: center;
			}
			.img_evident {
				width: 159px;
				margin: 0 auto 10px;
				display: block;
			}
			.qrCode {
				width: 171px;
				margin: 0 20px;
				display: inline-block;
				vertical-align: top;
			}
			.text_bottom_1 {
				font-size: 14px;
				padding: 2px 0 8px 0;
			}
			.text_bottom_2 {
				font-size: 13px;
			}
			.place_holder {
				height: 8px;
			}
			.qr_title {
				font-size: 24px;
				padding: 0px 0 4px 0;
				color: white;
			}
			.place_holder2 {
				height: 38px;
			}
		</style>
	</head>
	<body style="">
		<div class="certificate_box">
			<div class="certificate">
				<div class="cer_left">
					<div class="left_top">
						<img src="http://www.climatebridge.com/img/irec.jpg" class="img_irec" />
					</div>
					<div class="left_center">
						<div class="cola9 fs10">This Redemption Statement has been produced for</div>
						<div class="fs22 companyName">TAIAN LOTUSONG ARTS & CRAFTS CO., LTD.</div>
						<div class="cola9 fs10 pb10">by</div>
						<div class="fs18">CLIMATE BRIDGE (SHANGHAI) LTD</div>
						<div class="cola9 fs10">confirming the Redemption of</div>
						<div class="fs30 ptb10 Number_of_Certificates">999,999.000000</div>
						<div class="cola9 fs10 pb10">
							I-REC Certificates, representing&nbsp;<span class="Number_of_Certificates">999,999.000000</span>&nbsp;MWh of<br />
							electricity generated from renewable sources
						</div>
						<div class="cola9 fs10">This Statement relates to electricity consumption located at or in</div>
						<div class="address">No. 002, Xingye Street, Dongping Economic Development Zone, Tai'an City, Shandong Province</div>
						<div class="country">China</div>
						<div class="cola9 fs10 pb20">in respect of the reporting period</div>
						<div class="report_date_div"><span class="report_date BeginPurchaseDate">2023-01-01</span><span class="">&nbsp;to&nbsp;</span><span class="report_date EndPurchaseDate">2023-12-31</span></div>
						<div class="cola9 fs10 pb10 tc">The stated Redemption Purpose is</div>
						<div class="purpose_cb_logo_div">
							<div class="fs18 pb30 usage tc">Disclosure for Scope 2 Reporting.</div>
							<div class="img_cb_div">
								<img class="img_cb" src="http://www.climatebridge.com/img/cb-logo.png" />
							</div>
						</div>
					</div>
					<div class="buttom_area">
						<div class="img_evident_div">
							<img class="img_evident" src="http://www.climatebridge.com/img/evident-logo.png" />
						</div>
						<div class="green_bg">
							<div class="place_holder"></div>
							<div class="code_box">
								<img class="qrCode" src="http://www.climatebridge.com/img/qr.jpg" />
								<div class="relative" style="display: inline-block; width: 69%; text-align: center">
									<div class="qr_title">QR Code Verification</div>
									<div class="text_bottom_1">
										Verify the status of this Redemption Statement by scanning the QR code on <br />
										the left and entering in the Verification Key below
									</div>
									<div class="qr_title">Verification Key</div>
									<div class="fs20 pt10 key VerificationKey">7 2 8 8 0 8 5 1</div>
									<a class="text_bottom_2 pt10 link VerificationUrl" href="https://evident.app/public/certificates/en/RgGAW5tzkiDQ42lOGGOXUQTcsdtA1z/GXoEVz5uSnqKFOpukpFJNOomEQsoI7YQr" target="_blank"> <span class="VerificationUrl">https://evident.app/public/certificates/en/RgGAW5tzkiDQ42lOGGOXUQTcsdtA1z/GXoEVz5uSnqKFOpukpFJNOomEQsoI7YQr</span></a>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="cer_right tc">
					<div class="place_holder2" style="height: 41px; border-bottom: 1px solid #eee"></div>
					<div class="right_item fs20 fwb" style="height: 76px; padding-top: 5px; font-size: 26px; color: gray">Redeemed Certificates</div>
					<div style="margin: 0px 37px 0px 37px; border: 1px solid #eee">
						<div class="right_item fs16 fwb" style="border: none; padding-top: 10px; color: gray; height: 34px; font-size: 20px">Production Device Details</div>
						<table style="border-bottom: 1px solid #eee; width: 719px; text-align: center; border-spacing: 0px">
							<tbody>
								<tr style="background-color: #f4f5f4; height: 70px" class="fs12 fwb">
									<td>Device</td>
									<td>Country of Origin</td>
									<td>Energy Source</td>
									<td>Technology</td>
									<td>Supported</td>
									<td>Commisioning Date</td>
									<td style="border-right: none;">Carbon(CO₂/MWh)</td>
								</tr>
								<tr style="padding: 12px 7px" class="fs12">
									<td class="Device">Shuidaba Hydropower Project in Sichuan Province</td>
									<td class="Country_of_Origin">China</td>
									<td class="Energy_Source">Hydro-electric</td>
									<td class="Technology">Run of river</td>
									<td class="Supported">No</td>
									<td class="Commissioning_Date">2009-01-03</td>
									<td class="Co2_produced" style="border-right: none;">0.000</td>
								</tr>
							</tbody>
						</table>
						<div class="right_item fs16 fwb" style="border: none; height: 77px; color: gray; font-size: 20px">
							<div style="height: 45px"></div>
							Redeemed Certificates
						</div>
						<table style="border-bottom: 1px solid #eee; width: 719px; text-align: center; border-spacing: 0px">
							<tbody>
								<tr style="background-color: #f4f5f4; height: 70px" class="fs12 fwb">
									<td style="width: 126px">From Certificate ID</td>
									<td style="width: 126px">To Certificate ID</td>
									<td>Number of Certificates</td>
									<td>Offset Attributes</td>
									<td>Period of Production</td>
									<td width="80px" style="border-right: none;">Issuer</td>
								</tr>
								<tr style="padding: 12px 5px; font-size: 12px">
									<td class="From_Certificate_ID" style="width: 126px">0000-0002-7906-0947</td>
									<td class="To_Certificate_ID" style="width: 126px">0000-0002-7906-0947</td>
									<td class="Number_of_Certificates">99,999.000000</td>
									<td class="Offset_Attributes">Inc</td>
									<td><span class="BeginPurchaseDate">2022-07-01</span>&nbsp;-<br /><span class="EndPurchaseDate">2022-07-31</span></td>
									<td style="border-right: none;"><img src="http://www.climatebridge.com/img/gcc.jpg" /></td>
								</tr>
							</tbody>
						</table>
						<div style="height: 48px"></div>
					</div>
					<div style="height: 49px; border-bottom: 1px solid #eee; margin: 0px 37px 0px 37px"></div>
					<div class="notes fs12" style="margin: 0px 37px 0px 37px">
						<div class="fs16 pb15" style="height: 50px; font-size: 20px; color: gray">
							<div style="height: 21px"></div>
							Auditor Notes
						</div>
						<div class="pb15 notes_detail">This statement is proof of the secure and unique redemption of the I-RECs stated above for the named beneficiary to be reported against consumption in the country during the reporting year stated. I-RECs are assigned to a beneficiary at redemption and cannot be further assigned to a third party. No other use of these I-RECs is valid under the I-REC Standard.</div>
						<div class="pb15 notes_detail">Where offset attributes are 'inc' the device registrant, who exclusively holds the environmental attribute rights, has undertaken never to release carbon offsets in association with these MWh; 'excl' means carbon offsets relating to these MWh may be traded independently at some point in the future.</div>
						<div class="pb15 notes_detail">For labelling scheme information please refer to the scheme's website. Labelling scheme listing may not be exhaustive.</div>
						<div class="pb15 notes_detail">Thermal plant emit carbon as part of the combustion process. Whilst this is not zero carbon, it is generally recognised as carbon neutral where the source is recent biomass.</div>
					</div>
					<div style="height: 49px; border-bottom: 1px solid #eee; margin: 0px 37px 0px 37px"></div>
				</div>
			</div>
		</div>
		<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
		<script>
			// var url = "http://mall.climatebridge.com/greenid/api/";
			var url = 'http://139.196.154.95:8089/api/'
			var oss = "https://climatebridge-erp.oss-cn-shanghai.aliyuncs.com/dev/green-id/";
			var cert_url = "https://sandbox.evident.dev";
			var obj = window.location.search.substring(1);

			const index = obj.lastIndexOf("=");
			const code_id = obj.substring(index + 1, obj.length);
			var tradeId = code_id;
			let that = this;
			that.get_down();
			function get_down() {
				$.ajax({
					type: "POST",
					url: url + "v1/tradeCertificate/queryCertPdfParam",
					headers: {
						"Content-Type": "application/x-www-form-urlencoded",
					},
					dataType: "json",
					data: {
						tradeId: tradeId,
					},
					success: function (res) {
						var detail = res.root;
						detail.companyName = detail.Certificate.companyNameEn;
						detail.address = detail.Certificate.addressEn;
						detail.country = detail.Country_of_Origin;
						for (let i in detail) {
							if (i == "qrCode" || i == "VerificationUrl") {
								if (i == "qrCode") {
									$("." + i).attr("src", oss + detail[i]);
								} else {
									$("." + i).html(cert_url + detail[i]);
									$("." + i).attr("href", cert_url + detail[i]);
								}
							} else {
								$("." + i).html(detail[i]);
							}
						}
						that.get_html(detail.tcId);
					},
				});
			}

			function get_html(tcId) {
				var html = $("html").html();
				$.ajax({
					type: "POST",
					url: url + "v1/uploadMgr/generateTCPDFFromHtml",
					headers: {
						"Content-Type": "application/x-www-form-urlencoded",
					},
					dataType: "json",
					data: {
						html: html,
						tcId: tcId,
					},
					success: function (res) {
						if (res.resCode == 0) {
						} else {
							alert(res.resMsg);
						}
						that.downFile(oss + res.root);
					},
				});
			}
			function downFile(url) {
				const elink = document.createElement("a");
				elink.style.display = "none";
				elink.href = url + "?response-content-type=application/octet-stream";
				document.body.appendChild(elink);
				elink.click();
				URL.revokeObjectURL(elink.href);
				document.body.removeChild(elink);
			}
		</script>
	</body>
</html>
